<template>
  <div class="drawer-item">
    <div class="form-card mgt20 mgb20">
      <div class="form-title">{{ $t('setting.组合商品设置') }}</div>
      <div
        class="form-tag"
        @click="setIsOpenCombinationGoodsTypeDefault"
        :class="{
            'form-tag-diy': userForm.isOpenCombinationGoodsType !== 1,
            'form-tag-default': userForm.isOpenCombinationGoodsType === 1,
          }">{{userForm.isOpenCombinationGoodsType === 1 ? $t('userInfo.default') : $t('userInfo.custom')}}</div>
      <div>
        <div class="label-title">{{$t('setting.组合商品')}}</div>
        <el-radio-group v-model="userForm.isOpenCombinationGoods" @change="changeIsOpenCombinationGoodsType">
          <el-radio :label="0">{{ $t('setting.不允许') }}</el-radio>
          <el-radio :label="1">{{ $t('setting.允许组合') }}</el-radio>
        </el-radio-group>
      </div>

      <div class="form-content mgb20">
        <span class="font-grey f12">{{ $t('setting.允许组合后用户可将多个SKU绑定为一个SKU进行销售出货') }}</span>
      </div>
    </div>

    <div class="form-card mgt20 mgb20">
      <div class="form-title">{{ $t('pay.Credit Setting') }}</div>
      <div
        class="form-tag"
        @click="setCreditAmount"
        :class="{
            'form-tag-diy': userForm.creditAmountType !== 1,
            'form-tag-default': userForm.creditAmountType === 1,
          }">{{userForm.creditAmountType === 1 ? $t('userInfo.default') : $t('userInfo.custom')}}</div>

      <div>
        <div class="label-title">
          {{$t('pay.Credit limit')}}
        </div>
        <el-input-number
          v-model="userForm.creditAmount"
          @change="changeCreditAmount"
          autocomplete="off"
          :precision="2"
          :min="0"
        ></el-input-number>
        <span style="margin-left: 5px">{{ $t('common.RMB') }}</span>
      </div>
    </div>

    <div class="form-card mgt20 mgb20">
      <div class="form-title">{{ $t('setting.添加货件设置') }}</div>
      <div
        class="form-tag"
        @click="setShipmentTypeDefault"
        :class="{
            'form-tag-diy': userForm.shipmentType !== 1,
            'form-tag-default': userForm.shipmentType === 1,
          }">{{userForm.shipmentType === 1 ? $t('userInfo.default') : $t('userInfo.custom')}}</div>
      <div>
        <div class="label-title">{{$t('table.货箱类型')}}</div>
        <el-radio-group v-model="userForm.shipmentTableType" @change="changeShipmentType">
          <el-radio :label="1">{{ $t('setting.整箱和混箱') }}</el-radio>
          <el-radio :label="2">{{ $t('setting.仅整箱') }}</el-radio>
        </el-radio-group>
      </div>

      <div class="form-content mgb20">
        <span class="font-grey f12">{{ $t('setting.整箱为一个货件箱一个SKU，混箱支持一个货件箱多个SKU') }}</span>
      </div>
    </div>

    <template v-if="$store.getters.showMenuRemittance || true">
      <div class="form-card mgb20">
        <div class="label-title">{{$t('userInfo.Remittance commission')}}</div>
        <el-radio v-model="userForm.handlingChargeStatus" :label="1">{{ $t('userInfo.Additional charge') }}</el-radio>
        <el-radio v-model="userForm.handlingChargeStatus" :label="2">{{ $t('userInfo.Free of charge') }}</el-radio>
        <div style="font-size: 12px">{{ $t('userInfo.userInfoText8') }}</div>
        <div style="font-size: 12px">{{ $t('userInfo.userInfoText9') }}</div>
      </div>
    </template>


    <div class="form-card">
      <div class="label-title">{{$t('userInfo.Cooperation status')}}</div>
      <el-radio v-model="userForm.status" :label="1">{{ $t('user.In cooperation') }}</el-radio>
      <el-radio v-model="userForm.status" :label="2">{{ $t('user.Stop cooperation') }}</el-radio>
      <div style="font-size: 12px">{{ $t('userInfo.userInfoText6') }}</div>
      <div class="dialog-info">
        {{ $t('userInfo.userInfoText7') }}
      </div>
    </div>

  </div>
</template>

<script>
import GoodsSizePriceMixin from "@/views/setting/mixin/GoodsSizePriceMixin";
import {deepCopy} from "@/utils";

export default {
  name: 'OtherDrawerItem',
  props: {
    userSetting: {
      type: Object,
    },
    userForm: {
      type: Object,
    }
  },
  data(){
    return {}
  },
  methods: {
    setCreditAmount(){
      if(this.userForm.creditAmountType === 1){
        this.userForm.creditAmountType = 2;
      }else{
        this.userForm.creditAmountType = 1;
      }
      this.userForm.creditAmount = this.userSetting.creditAmount;
    },
    changeCreditAmount(){
      this.userForm.creditAmountType = 2;
    },
    setShipmentTypeDefault(){
      if(this.userForm.shipmentType === 1){
        this.userForm.shipmentType = 2
      }else{
        this.userForm.shipmentType = 1
      }
      this.userForm.shipmentTableType = this.userSetting.shipmentTableType
    },
    changeShipmentType(){
      this.userForm.shipmentType = 2;
    },
    setIsOpenCombinationGoodsTypeDefault(){
      if(this.userForm.isOpenCombinationGoodsType === 1){
        this.userForm.isOpenCombinationGoodsType = 2
      }else{
        this.userForm.isOpenCombinationGoodsType = 1
      }
      this.userForm.isOpenCombinationGoods = this.userSetting.isOpenCombinationGoods
    },
    changeIsOpenCombinationGoodsType(){
      this.userForm.isOpenCombinationGoodsType = 2;
    },
  }
}
</script>

<style scoped lang="scss">
@import "../scss/drawer-item";
.label-title{
  display: inline-block !important;
  min-width: 120px;
}
</style>
